import { Container, Image, SimpleGrid, Text, Title } from "@mantine/core";
import image from "./ecommerce.svg";
import classes from "./Welcome.module.css";

export function Welcome({ appName }) {
  return (
    <Container className={classes.root}>
      <SimpleGrid spacing={{ base: 40, sm: 80 }} cols={{ base: 1, sm: 2 }}>
        <Image src={image.src} className={classes.mobileImage} />
        <div>
          <Title className={classes.title}>欢迎使用{appName}</Title>

          <Text c="dimmed" size="lg">
            良品至信，心心相印
          </Text>
          <Text c="dimmed" size="lg">
            合理合法，简单明了
          </Text>
        </div>
        <Image src={image} className={classes.desktopImage} />
      </SimpleGrid>
    </Container>
  );
}
